<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>南声-文章详情</title>
		<link rel="stylesheet" type="text/css" href="./css/details.css" />
		<link rel="stylesheet" type="text/css" href="./css/reset.css" />
		<link rel="stylesheet" type="text/css" href="./layui/css/layui.css" />
		<script src="./js/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script src="./layui/layui.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<!-- header -->
		<header>
			<div class="headerInfo">
				<ul class="listLeft">
					<li>
						<a href="javascript:;">
							<img
								src="https://lf3-cdn-tos.bytescm.com/obj/static/xitu_juejin_web/dcec27cc6ece0eb5bb217e62e6bec104.svg">
						</a>
					</li>
					<li><a class="active" href="javascript:;">首页</a></li>
					<li><a href="javascript:;">沸点</a></li>
					<li><a href="javascript:;">资讯</a></li>
					<li><a href="javascript:;">小册</a></li>
					<li><a href="javascript:;">活动</a></li>
					<li><a href="javascript:;">开发者大会</a></li>
					<li><input type="text" placeholder="搜索" /></li>
				</ul>
				<ul class="listRight">
					<li><a href="javascript:;" class="devCenter">创作者中心</a></li>
					<li>
						<a href="javascript:;" class="write">
							写文章
							<i class="iconfont icon-caret-down"></i>
						</a>
					</li>
					<li><a class="loginBtn" href="./login.html">登录</a></li>
					<li class="userfaceLi">
						<a class="userface" href="javascript:;">
							
						</a>
						<div class="subMenu">
							<div><a href="javascript:;">写文章</a></div>
							<div><a id="logoutBtn" href="javascript:;">退出登录</a></div>
						</div>
					</li>
				</ul>
			</div>
		</header>
		<!-- details -->
		<div class="details">
			<div class="detailsArticles">
				<div class="authorInfoHeader">
					<div>
						<div><span class="userface">黑</span></div>
						<div style="margin-left: 10px;">
							<h3>黑 色 时 刻</h3>
							<span>2021年07月21日 阅读 2201</span>
						</div>
					</div>
					<div>
						<a class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs" href="javascript:;">关注</a>
					</div>
				</div>
				<br>
				<br>
				<div>
					<h1>手撕钉钉前端考试卷，offer，拿来吧你~</h1>
					<br><br>
					<div>
						子弈大佬出面试指南的本意也是帮助大家扫盲，让大家去了解一些可能自己没有接触过或者自己不知道的东西，这里面的大部分题目其实是在不断深入沟通的语境里产生的，也不影响对面试者的面试判断，纯粹属于那种面着面着觉得不错，觉得他能够答上来而给予的加分一问，不是大家理解的刁难人的意思。
					</div>
				</div>
				<p class="zan">
					<i class="layui-icon layui-icon-praise"></i>
					<span>118</span>
				</p>
			</div>
			<div class="detailsAuthor">

			</div>
		</div>
		<script type="text/javascript">
			userfaceCheck();
			function userfaceCheck() {
				let loginer = window.sessionStorage.getItem('loginer');
				if (loginer == null) {
					$('.userface').css('display', 'none');
					$('.loginBtn').css('display', 'block');
				} else {
					let name = JSON.parse(loginer).username.substr(0, 1);
					$('.userface').css('display', 'block').html(name);
					$('.loginBtn').css('display', 'none');
					$('.write').css('display', 'none');
				}
			}
			$('.write').click(function() {
				let loginer = window.sessionStorage.getItem('loginer');
				if (loginer == null) {
					window.location.href = './login.html';
				}
			})
			$('.userfaceLi').mouseover(function() {
				$('.subMenu').css('display', 'block');
			})
			$('.userfaceLi').mouseout(function() {
				$('.subMenu').css('display', 'none');
			})
			$('#logoutBtn').click(function() {
				if (confirm('是否确定退出')) {
					window.sessionStorage.removeItem('loginer');
					window.location.reload();
				}
			})
		</script>
	</body>
</html>
